<template>
	<view class="bookitem">
		<image :src="item.pic" class="bookitem__pic" mode="aspectFill"></image>
		<view class="bookitem__title">
			{{item.name}}
		</view>
		<view class="bookitem__type">
			{{item.zz}}
		</view>
		<view class="bookitem__check" v-if="isgl">
			<image v-if="!item.ischeck" src="/static/cz/noxuan.png" class="bookitem__check__icon" mode=""></image>
			<image v-else src="/static/cz/xuan.png" class="bookitem__check__icon" mode=""></image>
		</view>
	</view>
</template>

<script>
	export default {
		name: "bookitem",
		props: {
			item: {
				type: Object,
				default () {
					return {

					};
				}
			},
			isgl:{
				type: Boolean,
				default () {
					return false;
				}
			}
		},
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss">
	.bookitem {
		width: 218rpx;
		margin: 0 0 32rpx 24rpx;
		position: relative;

		&__pic {
			width: 218rpx;
			height: 294rpx;
			border-radius: 12rpx 12rpx 12rpx 12rpx;
			// margin-bottom: 8rpx;

		}

		&__title {
			width: 218rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 28rpx;
			color: #000000;
			line-height: 44rpx;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}

		&__type {
			width: 218rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 24rpx;
			color: #999999;
			line-height: 34rpx;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}

		&__check {
			position: absolute;
			top: 8rpx;
			right: 8rpx;

			&__icon {
				width: 36rpx;
				height: 36rpx;
			}
		}
	}
</style>